let count = 0;
export default {
  title: '文本',
  name: 'attachInput',
  getLabel() {
    return <div data-role="icon" data-component="attachInput" className="design-form-icon">附件</div>;
  },
  getBody(fieldId) {
    let container = $(`<div class="el-input drag-block drag-selectable" 
                      data-role="block" data-component="AttachInput"
                      id="${fieldId}"><div class="el-input__wrapper">
                       
                       <div class="el-upload el-upload--text  el-input__inner" tabindex="0">
                       <button aria-disabled="false" type="button" class="el-button is-round ">
                       <span class="">上传附件</span></button><input class="el-upload__input" name="file" multiple="" accept="" type="file"></div>
                       
                       </div>`)[0];

    $(container).append(this.createDragBars());
    return container;
  },
  createDragBars() {
    let barContainer = $(`<div class="drag-bar-container"></div>`);
    let bars = this.createBars();
    barContainer.append(bars);
    return barContainer;
  },
  createFieldConfig(fieldId) {
    return {
      id: fieldId,
      fieldName: '',
      showName: '附件',
      alias: undefined,
      inputType: 'text',
      component: 'AttachInput',
    };
  },
  createBars() {
    let moveBar = $(`<div class="drag-move-bar"><i class="el-icon" data-v-ea893728="" style="font-size: 20px;"><svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ea893728=""><path fill="currentColor" d="m186.496 544 41.408 41.344a32 32 0 1 1-45.248 45.312l-96-96a32 32 0 0 1 0-45.312l96-96a32 32 0 1 1 45.248 45.312L186.496 480h290.816V186.432l-41.472 41.472a32 32 0 1 1-45.248-45.184l96-96.128a32 32 0 0 1 45.312 0l96 96.064a32 32 0 0 1-45.248 45.184l-41.344-41.28V480H832l-41.344-41.344a32 32 0 0 1 45.248-45.312l96 96a32 32 0 0 1 0 45.312l-96 96a32 32 0 0 1-45.248-45.312L832 544H541.312v293.44l41.344-41.28a32 32 0 1 1 45.248 45.248l-96 96a32 32 0 0 1-45.312 0l-96-96a32 32 0 1 1 45.312-45.248l41.408 41.408V544H186.496z"></path></svg></i></div>`);
    let removeBar = $(`<div class="drag-delete-bar"><i class="el-icon" data-v-ea893728="" style="font-size: 20px;"><svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ea893728=""><path fill="currentColor" d="M352 192V95.936a32 32 0 0 1 32-32h256a32 32 0 0 1 32 32V192h256a32 32 0 1 1 0 64H96a32 32 0 0 1 0-64h256zm64 0h192v-64H416v64zM192 960a32 32 0 0 1-32-32V256h704v672a32 32 0 0 1-32 32H192zm224-192a32 32 0 0 0 32-32V416a32 32 0 0 0-64 0v320a32 32 0 0 0 32 32zm192 0a32 32 0 0 0 32-32V416a32 32 0 0 0-64 0v320a32 32 0 0 0 32 32z"></path></svg></i></div>`);
    return [moveBar, removeBar];
  },
  bind(ele) {
  },
  bindWithElement(dragElement) {
  },
  resolveFieldType() {
    return 'string';
  },
  resolveTitleField(fieldConfig) {
    return fieldConfig;
  },
};
